<template>
  <!--
    数据资产DI-列表页
   -->
  <div class="h-full flex flex-col">
    <a-card>
      <div slot="title">
        <a-space>
          <div class="ty"></div>
          {{ $t("user.login.userName") }}
        </a-space>
        <!-- 操作按钮 -->
        <a-dropdown style="right: 0; position: absolute; margin-right: 25px">
          <a-menu slot="overlay">
            <a-menu-item key="1" @click="showModal('add')">
              {{ $t("user.login.login") }}
            </a-menu-item>
            <a-menu-item
              key="2"
              @click="start"
              v-if="userroleid.indexOf('35') != -1"
              :disabled="!hasSelected"
            >
              {{ $t("user.password.strength.low222333") }}
            </a-menu-item>
          </a-menu>
          <a-button type="primary">
            <a-icon type="bars" />
            {{ $t("di.menus") }}
            <a-icon type="down" />
          </a-button>
        </a-dropdown>
      </div>
      <!-- 主列表 -->
      <a-table
        ref="table"
        size="middle"
        class="h-full overflow-x-auto"
        :dataSource="tableListData"
        :pagination="false"
        @change="tableChange"
        :loading="listLoading"
        :rowKey="(record) => record.Id"
        :scroll="{ x: 2000, y: 2000 }"
      >
        <!-- 数据资产ID  -->
        <a-table-column
          key="DataAssetsId"
          data-index="DataAssetsId"
          width="120px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(1);
            }
          "
        >
          <span slot="title">{{ $t("user.register.register5566") }}</span>
          <!--  筛选+搜索功能  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect1"
              :filter-data="filterData"
              @searchCommit="searchQuery"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
        </a-table-column>
        <!-- 数据详情 -->
        <a-table-column
          key="details"
          :title="$t('user.register.email.placeholder')"
          width="140px"
        >
          <template slot-scope="row">
            <span
              style="color: #7188ff; cursor: pointer"
              @click="showEye(row)"
              v-if="row.details.length > 0"
            >
              <span v-if="lang === 'zh-CN'">
                <span style="margin-right: 3px">{{
                  row.details[0].DataItem
                }}</span
                ><a-icon type="eye" />
              </span>
              <span v-else>
                <span style="margin-right: 3px">{{
                  row.details[0].DataItemEn
                }}</span
                ><a-icon type="eye" />
              </span>
            </span>
            <span v-else class="blocks"> N/A </span>
          </template>
        </a-table-column>
        <!-- RPAID  -->
        <a-table-column
          key="RpaId"
          data-index="RpaId"
          width="140px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(10);
            }
          "
        >
          <span slot="title">RPA ID</span>
          <!--  搜索功能  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect9"
              :filter-data="filterData"
              @searchCommit="searchQuery"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>


          <template slot-scope="text, record">
            <rpaDetail :rpaDetailId="record.RpaId" />
            <!-- {{ text }} -->

            <!-- <a v-for="item in text.split(',').filter(item => item)" :key="index">
              {{ item.trim() }}
              <br>
            </a> -->


          </template>
        </a-table-column>
        <!-- 线上、线下  -->
        <a-table-column
          key="DataLibraryEnvironment"
          data-index="DataLibraryEnvironment"
          width="105px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(8);
            }
          "
        >
          <span slot="title">{{ $t("user.login.tab-login-credentials") }}</span>
          <!--  筛选  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect8"
              :single-search="false"
              :filter-data="filterData"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
          <!--  内容  -->
          <template slot-scope="text, record">
            <span v-if="text == ''" class="blocks"> N/A </span>
            <span v-else>
              <span v-if="lang === 'zh-CN'">
                {{ record.DataLibraryEnvironment }}
              </span>
              <span v-else>
                {{ record.DataLibraryEnvironmentEn }}
              </span>
            </span>
          </template>
        </a-table-column>
        <!-- 数据控制者  -->
        <a-table-column
          key="DataLibraryController"
          data-index="DataLibraryController"
          width="140px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValusKey = 9;
            }
          "
        >
          <span slot="title">{{ $t("user.login.remember-me") }}</span>
          <!--  搜索功能  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect7"
              :filter-data="[]"
              @searchCommit="searchQuery"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
          <!--  内容  -->
          <template slot-scope="text, record">
            <span v-if="text == ''" class="blocks"> N/A </span>
            <span v-else>
              {{ record.DataLibraryController }}
            </span>
          </template>
        </a-table-column>
        <a-table-column
          key="AppName"
          data-index="AppName"
          width="120px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(12);
            }
          "
        >
          <span slot="title">{{ $t("menu.list.search-list.projects") }}</span>
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect12"
              :filter-data="filterData"
              @searchCommit="searchQuery"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
          <!--  内容  -->
          <template slot-scope="text, record">
            <span v-if="text == ''" class="blocks"> N/A </span>
            <span v-else>
              {{ record.AppName }}
            </span>
          </template>
        </a-table-column>
        <!-- APP负责人  -->
        <a-table-column
          key="AppOwner"
          data-index="AppOwner"
          width="130px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(6);
            }
          "
        >
          <span slot="title">{{ $t("user.register.register") }}</span>
          <!--  筛选  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect6"
              :single-search="false"
              :filter-data="filterData"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
          <!--  内容  -->
          <template slot-scope="text, record">
            <span v-if="text == ''" class="blocks"> N/A </span>
            <span v-else>
              {{ record.AppOwner }}
            </span>
          </template>
        </a-table-column>
        <!-- App所属部门  -->
        <a-table-column
          key="AppDepartment"
          data-index="AppDepartment"
          width="150px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(2);
            }
          "
        >
          <!--  标题  -->
          <span slot="title">{{ $t("user.login.password.placeholder") }}</span>
          <!--  筛选+搜索功能  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect2"
              :filter-data="filterData"
              @searchCommit="searchQuery"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
          <!--  内容  -->
          <template slot-scope="text, record">
            <span v-if="text == ''" class="blocks"> N/A </span>
            <span v-else>
              {{ record.AppDepartment }}
            </span>
          </template>
        </a-table-column>
        <!-- BmwAppId  -->
        <a-table-column
          key="BmwAppId"
          data-index="BmwAppId"
          width="150px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(3);
            }
          "
        >
          <span slot="title">enterprise APP ID</span>
          <!--  筛选+搜索功能  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect3"
              :filter-data="filterData"
              @searchCommit="searchQuery"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
          <!--  内容  -->
          <template slot-scope="text, record">
            <span v-if="text == ''" class="blocks"> N/A </span>
            <span v-else>
              {{ record.BmwAppId }}
            </span>
          </template>
        </a-table-column>
        <!-- BbaAppId  -->
        <a-table-column
          key="BbaAppId"
          data-index="BbaAppId"
          width="150px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(4);
            }
          "
        >
          <span slot="title">企业 APP ID</span>
          <!--  筛选+搜索功能  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect4"
              :filter-data="filterData"
              @searchCommit="searchQuery"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
          <!--  内容  -->
          <template slot-scope="text, record">
            <span v-if="text == ''" class="blocks"> N/A </span>
            <span v-else>
              {{ record.BbaAppId }}
            </span>
          </template>
        </a-table-column>
        <!-- FeatherId  -->
        <a-table-column
          key="FeatherId"
          data-index="FeatherId"
          width="150px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(5);
            }
          "
        >
          <span slot="title">Feature ID</span>
          <!--  筛选+搜索功能  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect5"
              :filter-data="filterData"
              @searchCommit="searchQuery"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
          <!--  内容  -->
          <template slot-scope="text, record">
            <span v-if="text == ''" class="blocks"> N/A </span>
            <span v-else>
              {{ record.FeatherId }}
            </span>
          </template>
        </a-table-column>
        <!-- 状态 -->
        <a-table-column
          key="DataLibraryState"
          :title="$t('user.login.message-invalid-verification-code0011')"
          width="80px"
          @filterDropdownVisibleChange="
            (e) => {
              if (e) this.setValus(11);
            }
          "
        >
          <template slot-scope="text, record">
            <span>
              <div v-if="record.DataLibraryState == 0">
                <a-badge color="red" />{{
                  $t("menu.account.setting.offline1111")
                }}
              </div>
              <div v-if="record.DataLibraryState == 1">
                <a-badge color="blue" />{{
                  $t("user.verification-code.required111566133")
                }}
              </div>
              <div v-if="record.DataLibraryState == 2">
                <a-badge status="success" />{{
                  $t("user.verification-code.required111566144")
                }}
              </div>
            </span>
          </template>
          <!--  筛选  -->
          <span
            slot="filterDropdown"
            slot-scope="{
              setSelectedKeys,
              selectedKeys,
              confirm,
              clearFilters,
              column,
            }"
          >
            <table-select
              ref="tableselect10"
              :single-search="false"
              :filter-data="filterData"
              @searchFilter="searchQueryFilter"
              @searchClose="confirm"
              @searchClean="tableCleanJobs"
            />
          </span>
        </a-table-column>
        <!-- 操作 -->
        <a-table-column
          key="action"
          :title="$t('menu.exception.not-find')"
          width="150px"
          fixed="right"
        >
          <template slot-scope="text, record">
            <span>
              <a-dropdown>
                <a-button type="link">
                  <a-icon type="more" />
                </a-button>
                <template #overlay>
                  <a-menu>
                    <!-- 详情 -->
                    <a-menu-item @click="showModal('detail', record.Id)">
                      <a-button type="link">{{
                        $t("user.register.password.popover-message")
                      }}</a-button>
                    </a-menu-item>

                    <!-- 编辑/修改按钮 -->
                    <a-menu-item
                      v-if="
                        record.AppOwnerId == userdata.YtId ||
                        record.DataLibraryUserId == userdata.YtId ||
                        userdata.SystemOperators
                      "
                      @click="showModal('edit', record.Id)"
                    >
                      <a-button type="link">{{
                        $t("user.verification-code.required111566147")
                      }}</a-button>
                    </a-menu-item>

                    <!-- 删除按钮 -->
                    <a-menu-item
                      v-if="
                        record.AppOwnerId == userdata.YtId ||
                        record.DataLibraryUserId == userdata.YtId ||
                        userdata.SystemOperators
                      "
                    >
                      <a-popconfirm
                        :title="
                          $t('user.verification-code.required111566110577225')
                        "
                        :ok-text="$t('user.verification-code.required1166')"
                        :cancel-text="$t('user.email.required11')"
                        @confirm="() => del(record.Id)"
                      >
                        <a-button
                          type="link"
                          size="small"
                          style="
                            margin-left: 9px;
                            width: 100%;
                            text-align: left;
                          "
                          >{{ $t("menu.exception.trigger") }}</a-button
                        >
                      </a-popconfirm>
                    </a-menu-item>
                  </a-menu>
                </template>
              </a-dropdown>
            </span>
          </template>
        </a-table-column>
      </a-table>
      <!-- 分页 -->
      <a-pagination
        size="small"
        v-model="pagination.page"
        :total="pagination.total"
        hideOnSinglePage
        :pageSize.sync="pagination.pageSize"
        @change="getList"
      />
      <!-- 大抽屉 -->
      <a-drawer
        :title="modalTitle"
        placement="right"
        :closable="false"
        :visible="modalVisible"
        :width="1200"
        :rowKey="(record) => record.Id"
        @close="closeDrawer"
      >
        <a-form :form="form" ref="form" class="drawer-form" label-align="left">
          <!-- APP名称 -->
          <a-row :gutter="24">
            <a-col :span="8">
              <a-form-item
                :label="
                  $t('user.verification-code.required1115661105772124555')
                "
              >
                <a-select
                  :placeholder="
                    $t(
                      'user.verification-code.required1115661105772113464357654435'
                    )
                  "
                  @change="handleChangeAppid"
                  show-search
                  option-filter-prop="children"
                  v-decorator="[
                    'DataLibraryAppidId',
                    {
                      rules: [
                        {
                          required: true,
                          message: $t(
                            'user.verification-code.required111566110577280'
                          ),
                        },
                      ],
                    },
                  ]"
                  :disabled="see"
                >
                  <a-select-option
                    v-for="item in appidLists"
                    :value="item.value"
                    :key="item.value"
                  >
                    {{ item.label }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <!-- APP负责人 -->
              <a-form-item
                :label="$t('user.login.mobile.verification-code.placeholder')"
              >
                <a-input
                  v-decorator="['AppOwner']"
                  :placeholder="
                    $t('user.login.mobile.verification-code.placeholder11')
                  "
                  disabled
                />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item :label="$t('user.login.password.placeholder')">
                <a-input
                  v-decorator="['AppDepartment']"
                  :placeholder="$t('user.login.message-invalid-credentials')"
                  disabled
                />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24">
            <a-col :span="8">
              <a-form-item label="enterprise APP ID">
                <a-input
                  v-decorator="['BmwAppId']"
                  placeholder="enterprise APP ID"
                  disabled
                />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item label="企业 APP ID">
                <a-input
                  v-decorator="['BbaAppId']"
                  placeholder="企业 APP ID"
                  disabled
                />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item label="Feature ID">
                <a-input
                  v-decorator="['FeatherId']"
                  placeholder="Feature ID"
                  disabled
                />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row
            :gutter="24"
            v-show="
              modalTitle != $t('user.verification-code.required1115667766')
            "
          >
            <a-col :span="8">
              <a-form-item
                :label="
                  $t('user.verification-code.required1115661105771411111')
                "
              >
                <a-input v-decorator="['DataLibraryUser']" disabled />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item
                :label="$t('user.verification-code.required111566110577142')"
              >
                <a-input v-decorator="['DataLibraryCreateTime']" disabled />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item
                :label="$t('user.verification-code.required111566110577143')"
              >
                <a-input v-decorator="['DataLibraryUpdateTime']" disabled />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24">
            <a-col :span="8">
              <!-- 数据控制者 -->
              <a-form-item :label="$t('user.login.remember-me')">
                <a-select
                  mode="multiple"
                  @change="changeselect"
                  :value="selectedItems"
                  option-filter-prop="children"
                  v-decorator="[
                    'DataLibraryController',
                    {
                      rules: [
                        {
                          required: true,
                          message: $t('user.login.forgot-password'),
                        },
                      ],
                    },
                  ]"
                  :placeholder="$t('user.login.forgot-password')"
                  :disabled="see"
                >
                  <a-select-option
                    v-for="item in systemControllerSourceData"
                    :value="item.value"
                    :key="item.value"
                    >{{ item.label }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="8" v-if="otherflag">
              <a-form-item label="Other">
                <a-input
                  v-decorator="[
                    'DataLibraryControllerOther',
                    {
                      rules: [
                        {
                          required: true,
                          message: $t(
                            'user.verification-code.required111566110577336'
                          ),
                        },
                      ],
                    },
                  ]"
                  :disabled="see"
                />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <!-- 线上/线下 -->
              <a-form-item :label="$t('user.login.tab-login-credentials')">
                <a-select
                  v-decorator="[
                    'DataLibraryEnvironment',
                    {
                      rules: [
                        {
                          required: true,
                          message: $t(
                            'user.verification-code.required1115661105773368800'
                          ),
                        },
                      ],
                    },
                  ]"
                  show-search
                  option-filter-prop="children"
                  :filter-option="filterOption"
                  :placeholder="$t('user.login.tab-login-mobile')"
                  :disabled="see"
                >
                  <a-select-option
                    v-for="item in Xians"
                    :value="item.value"
                    :key="item.value"
                  >
                    {{ lang === "zh-CN" ? item.label : item.labelEn }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
          <a-form-item label="ID" v-show="false" class="hidden">
            <a-input v-decorator="['Id']" disabled />
          </a-form-item>
          <!-- 数据详情 -->
          <a-form-item style="margin-right: 0">
            <div style="position: relative">
              <div
                style="
                  color: red;
                  margin-top: -10px;
                  display: inline-block;
                  top: 9px;
                  z-index: 99;
                "
              >
                *
              </div>
              {{ $t("user.register.email.placeholder") }}
            </div>
            <template>
              <a-table
                size="middle"
                :data-source="dataDetailInfoTables"
                :pagination="{ pageSize: 10 }"
                :rowKey="(record) => record.key"
              >
                <!-- 数据字段 -->
                <a-table-column
                  key="DataItem"
                  :data-index="
                    lang === 'zh-CN' ? 'DataItemsStr' : 'DataItemsStrEn'
                  "
                  width="150"
                >
                  <span slot="title">{{
                    $t("app.setting.themecolor.dust")
                  }}</span>
                  <!-- 表格右下角操作 -->
                  <template slot-scope="text, record">
                    <!-- 数据项 -->
                    <div v-if="'RpaType' in record">
                      <a-select
                        :placeholder="$t('app.setting.themecolor.dust')"
                        v-model="record.DataItemStr"
                        :show-arrow="false"
                        show-search
                        @change="handleDiChange"
                        @search="handleSearch"
                        option-filter-prop="children"
                        :filter-option="false"
                        style="max-width: 280px; min-width: 140px"
                        v-if="$t('app.setting.themecolor.dust') == '数据字段'"
                      >
                        <a-select-option
                          v-for="item in dataItemsSearchData"
                          :value="item.value"
                          :key="item.value"
                        >
                          <a-tooltip placement="topLeft">
                            <template slot="title">
                              {{ item.label }}
                            </template>
                            {{ item.label }}
                          </a-tooltip>
                        </a-select-option>
                      </a-select>
                      <a-select
                        :placeholder="$t('app.setting.themecolor.dust')"
                        v-model="record.DataItemStr"
                        :show-arrow="false"
                        show-search
                        @change="handleDiChange"
                        @search="filterSearchInputOptionEn"
                        option-filter-prop="children"
                        :filter-option="false"
                        style="max-width: 280px; min-width: 140px"
                        v-else
                      >
                        <a-select-option
                          v-for="item in dataItemsSearchData"
                          :value="item.value"
                          :key="item.value"
                        >
                          <a-tooltip placement="topLeft">
                            <template slot="title">
                              {{ item.labelEn }}
                            </template>
                            {{ item.labelEn }}
                          </a-tooltip>
                        </a-select-option>
                      </a-select>
                    </div>
                    <a v-else>
                      {{
                        record[
                          lang === "zh-CN" ? "DataItemStr" : "DataItemStrEn"
                        ]
                      }}
                    </a>
                    <!-- 删除按钮 -->
                    <a-popconfirm
                      :title="
                        $t('user.verification-code.required111566110577225')
                      "
                      :ok-text="$t('user.verification-code.required1166')"
                      :cancel-text="$t('user.email.required11')"
                      @confirm="deletes(record)"
                      v-if="!see"
                    >
                      <a-button type="link"
                        >{{ $t("menu.exception.trigger") }}
                      </a-button>
                    </a-popconfirm>
                  </template>
                </a-table-column>
                <!-- 数据级别 -->
                <a-table-column
                  key="DataLevelStr"
                  data-index="DataLevelStr"
                  width="150"
                >
                  <span slot="title">{{
                    $t("app.setting.themecolor.sunset")
                  }}</span>
                </a-table-column>
                <!-- 数据敏感度 -->
                <a-table-column
                  key="DataSensitiveStr"
                  data-index="DataSensitiveStr"
                  width="150"
                >
                  <span slot="title">{{
                    $t("app.setting.themecolor.green")
                  }}</span>
                </a-table-column>
                <!-- 所在城市 -->
                <a-table-column
                  key="DataCity"
                  data-index="DataCity"
                  width="150"
                  :allowClear="false"
                  :noFoundContent="noFoundContentText"
                >
                  <span slot="title">{{
                    $t("user.register.get-verification-codeeeee")
                  }}</span>
                  <template slot-scope="text, record">
                    <a-select
                      mode="multiple"
                      v-model="record.DataCity"
                      option-filter-prop="children"
                      :placeholder="
                        $t('user.verification-code.required111566110577338')
                      "
                      style="width: 128px"
                      :disabled="see"
                    >
                      <a-select-option
                        v-for="item in sonfigurationItemsContent"
                        :value="item.value"
                        :key="item.value"
                      >
                        {{ item.label }}
                      </a-select-option>
                    </a-select>
                  </template>
                </a-table-column>
                <!-- 数据存储地点 -->
                <a-table-column
                  key="DataDeposit"
                  data-index="DataDeposit"
                  width="150"
                >
                  <span slot="title">{{
                    $t("user.register.sign-innnnn")
                  }}</span>
                  <template slot-scope="text, record">
                    <a-select
                      mode="multiple"
                      v-model="record.DataDeposit"
                      option-filter-prop="children"
                      :placeholder="
                        $t('user.verification-code.required111566110577339')
                      "
                      style="width: 128px"
                      :disabled="see"
                    >
                      <a-select-option
                        v-for="item in fonfigurationItemsContent"
                        :value="item.value"
                        :key="item.value"
                      >
                        {{ item.label }}
                      </a-select-option>
                    </a-select>
                  </template>
                </a-table-column>

                <!-- 来源 -->
                <a-table-column
                  key="DataSource"
                  :title="$t('user.register-result.msg')"
                >
                  <template slot-scope="text, record">
                    <span>
                      <div class="conter">
                        <a-select
                          v-model="record.DataSource"
                          :placeholder="$t('user.register-result.msg')"
                          option-filter-prop="children"
                          style="max-width: 158px; min-width: 140px"
                          :disabled="see"
                          mode="multiple"
                          @search="fetchUser"
                        >
                          <template slot="notFoundContent">
                            <center>
                              <a-button
                                type="dashed"
                                @click="onChange1(record, 'DataSource')"
                                v-if="!appidLists.length"
                                >{{ $t("rpa.form.AddApplication") }}
                              </a-button>
                            </center>
                          </template>
                          <a-select-option
                            v-for="item in appidLists"
                            :value="item.value"
                            :key="item.value"
                          >
                            {{ item.label }}
                          </a-select-option>
                        </a-select>
                      </div>
                    </span>
                  </template>
                </a-table-column>
                <!-- 目的地 -->
                <a-table-column
                  key="DataDestination"
                  :title="$t('user.register-result.activation-email')"
                >
                  <template slot-scope="text, record">
                    <span>
                      <div class="conter">
                        <a-select
                          mode="multiple"
                          v-model="record.DataDestination"
                          :disabled="see"
                          @search="fetchUser"
                          option-filter-prop="children"
                          :placeholder="
                            $t('user.register-result.activation-email')
                          "
                          style="max-width: 158px; min-width: 140px"
                        >
                          <template slot="notFoundContent">
                            <center>
                              <a-button
                                type="dashed"
                                @click="onChange1(record, 'DataDestination')"
                                v-if="!appidLists.length"
                                >{{ $t("rpa.form.AddApplication") }}
                              </a-button>
                            </center>
                          </template>
                          <a-select-option
                            v-for="item in appidLists"
                            :value="item.value"
                            :key="item.value"
                          >
                            {{ item.label }}
                          </a-select-option>
                        </a-select>
                      </div>
                    </span>
                  </template>
                </a-table-column>

                <!-- 身份信息下的删除 -->
                <span slot="cityAction" slot-scope="text, record">
                  <a-select
                    mode="multiple"
                    v-model="record.DataCity"
                    :placeholder="$t('user.register.get-verification-code')"
                    style="width: 128px"
                    v-decorator="[
                      {
                        rules: [
                          {
                            required: true,
                            message: 'Please input your note!',
                          },
                        ],
                      },
                    ]"
                  >
                    <a-select-option
                      v-for="items in sonfigurationItemsContent"
                      :value="items.value"
                      :key="items.value"
                      >{{ items.label }}</a-select-option
                    >
                  </a-select>
                </span>
                <span slot="depositAction" slot-scope="text, record">
                  <a-select
                    v-model="record.DataDeposit"
                    :placeholder="$t('user.register.sign-in')"
                    style="width: 128px"
                  >
                    <a-select-option
                      v-for="item in fonfigurationItemsContent"
                      :value="item.value"
                      :key="item.value"
                    >
                      {{ item.label }}
                    </a-select-option>
                  </a-select>
                </span>
                <span slot="sourceAction" slot-scope="text, record">
                  <a-select
                    v-model="record.DataSource"
                    :placeholder="$t('user.register-result.msg')"
                    style="width: 128px"
                  >
                    <a-select-option
                      v-for="item in appidLists"
                      :value="item.value"
                      :key="item.value"
                    >
                      {{ item.label }}
                    </a-select-option>
                  </a-select>
                </span>
                <span slot="destinationAction" slot-scope="text, record">
                  <a-select
                    v-model="record.DataDestination"
                    :placeholder="$t('user.register-result.activation-email')"
                    style="width: 128px"
                  >
                    <a-select-option
                      v-for="item in appidLists"
                      :value="item.value"
                      :key="item.value"
                    >
                      {{ item.label }}
                    </a-select-option>
                  </a-select>
                </span>
              </a-table>
              <!-- 发现导入 -->
              <a-button
                type="link"
                icon="vertical-align-bottom"
                @click="openModal"
                v-if="!see"
                >{{ $t("user.register-result.msg6868") }}
              </a-button>
              <!-- 新增字段 -->
              <a-button type="link" @click="changelist" v-if="!see"
                >{{ $t("app.setting.themecolor.gggg") }}
              </a-button>
              <!-- 新增DI上传excel    -->
              <a-upload
									name="file"
									accept=".xlsx, .xls"
									:multiple="false"
                  :customRequest="handleFileUpload" 
                  :showUploadList="false"
                  v-if="ecxelSee"
								>
									<a-button>
										<a-icon type="upload" />
										{{
											$t(
												'user.verification-code.required111566163'
											)
										}}
									</a-button>
								</a-upload>

            </template>
          </a-form-item>
        </a-form>
        <div
          :style="{
            position: 'absolute',
            right: 0,
            bottom: 0,
            width: '100%',
            borderTop: '1px solid #e9e9e9',
            padding: '10px 16px',
            background: '#fff',
            textAlign: 'center',
            zIndex: 1,
          }"
        >
          <!-- 提交 -->
          <a-button
            type="primary"
            @click="submitCreate()"
            style="margin-right: 20px"
            v-if="!see"
            >{{ $t("user.register-result.back-home") }}
          </a-button>
          <!-- 保存草稿 -->
          <a-button @click="submitSave()" style="margin-right: 20px" v-if="!see"
            >{{ $t("user.register-result.view-mailbox") }}
          </a-button>
          <a-button style="margin-right: 8px" @click="closeDrawer"
            >{{ $t("user.email.required11") }}
          </a-button>
        </div>
      </a-drawer>

      <!-- 导入步骤条 -->
      <a-modal
        :visible="visible"
        @ok="handleOk"
        @cancel="handleCancel"
        width="600px"
      >
        <div style="margin-top: 20px">
          <a-steps :current="current">
            <a-step
              v-for="item in steps"
              :key="item.title"
              :title="$t(item.title)"
            />
          </a-steps>
          <div class="steps-content" style="margin-top: 20px">
            <a-form
              layout="inline"
              v-show="steps[current].content == 'firstStep'"
              style="padding-bottom: 100px"
              :form="diForm"
            >
              <!-- 第一步 -->
              <a-form-item
                class="appids"
                :label="
                  $t('user.verification-code.required1115661105772124555')
                "
              >
                <a-row>
                  <a-col :span="24">
                    <a-select
                      :placeholder="$t('user.login.mobile.placeholder5656')"
                      @change="handleChangeDiAppid"
                      v-decorator="[
                        'DiscoverAppId',
                        {
                          rules: [
                            {
                              required: true,
                              message: $t('user.login.mobile.placeholder5656'),
                            },
                          ],
                        },
                      ]"
                      style="width: 270px"
                    >
                      <a-select-option
                        v-for="item in appidLists"
                        :value="item.label"
                        :key="item.value"
                      >
                        {{ item.label }}
                      </a-select-option>
                    </a-select>
                  </a-col>
                </a-row>
              </a-form-item>
              <a-form-item
                class="appids"
                :label="$t('user.verification-code.required11156633')"
              >
                <a-row>
                  <a-col :span="24" v-if="treeData.length > 0">
                    <!-- 选中后查询 -->
                    <a-tree
                      defaultExpandAll
                      v-model:checkedKeys="checkedKeys"
                      checkable
                      :tree-data="treeData"
                    >
                      <template #title="{ title, key }">
                        <span v-if="key === '0-0-1-0'" style="color: #1890ff">{{
                          title
                        }}</span>
                        <template v-else>{{ title }}</template>
                      </template>
                    </a-tree>
                  </a-col>
                  <a-col :span="24" v-else
                    >{{ $t("user.verification-code.required11156677") }}
                  </a-col>
                </a-row>
              </a-form-item>
            </a-form>
            <!-- 第二步 -->
            <a-row v-show="steps[current].content == 'secondStip'">
              <a-col :span="24">
                <!-- 选中的分类表 -->
                <a-table
                  ref="table"
                  size="middle"
                  class="h-full"
                  style="right: 0"
                  :dataSource="dccDiData"
                  :pagination="true"
                  :loading="listLoading"
                  :rowKey="(record) => record.Id"
                >
                  <a-table-column key="Items" data-index="Items" width="150">
                    <span slot="title">{{
                      $t("app.setting.themecolor.dust")
                    }}</span>
                  </a-table-column>
                  <a-table-column
                    key="Classification"
                    data-index="Classification"
                    width="150"
                  >
                    <span slot="title">{{
                      $t("user.verification-code.required11156644")
                    }}</span>
                    <template slot-scope="text, record">
                      <a-select
                        v-model="record.Classification"
                        :placeholder="
                          $t('user.verification-code.required11156666')
                        "
                        style="width: 198px"
                      >
                        <a-select-option
                          v-for="(item, index) in dccSelectData"
                          :value="item.value"
                          :key="item.value"
                        >
                          {{ lang === "zh-CN" ? item.label : item.labelEn }}
                        </a-select-option>
                      </a-select>
                    </template>
                  </a-table-column>
                  <a-table-column key="Result" data-index="Result" width="150">
                    <span slot="title">{{
                      $t("user.verification-code.required11156655")
                    }}</span>
                    <template slot-scope="text, record">
                      <div v-if="record.Result == '未匹配'" style="color: red">
                        {{ lang === "zh-CN" ? record.Result : record.ResultEn }}
                      </div>
                      <div v-else>
                        {{ lang === "zh-CN" ? record.Result : record.ResultEn }}
                      </div>
                    </template>
                  </a-table-column>
                </a-table>
                <a-button type="primary" @click="mate()"
                  >{{ $t("user.phone-number.required") }}
                </a-button>
              </a-col>
            </a-row>
          </div>
          <div class="steps-action"></div>
        </div>

        <template slot="footer">
          <!-- <a-button key="submit" type="primary" :loading="loading" @click="handleOk">
          Submit
        </a-button> -->
          <a-button v-if="current > 0" style="margin-left: 8px" @click="prev">
            {{ $t("user.verification-code.required11156611") }}
          </a-button>
          <a-button
            v-if="current < steps.length - 1"
            type="primary"
            @click="next"
          >
            {{ $t("user.verification-code.required11156622") }}
          </a-button>
          <a-button
            v-if="current == steps.length - 1"
            type="primary"
            @click="handleOk"
          >
            {{ $t("user.verification-code.required1166") }}
          </a-button>
          <!-- 取消 -->
          <a-button key="back" @click="handleCancel">
            {{ $t("user.email.required11") }}
          </a-button>
        </template>
      </a-modal>
      <!-- 查看匹配数据 -->
      <a-modal
        :title="detailTitle"
        :visible="eyeDrawer"
        width="750px"
        @cancel="closeEyeDrawer"
      >
        <a-table
          style="width: 700px"
          :data-source="eyeDrawerList"
          bordered
          :rowKey="(record) => record.Id"
        >
          <a-table-column key="DataItem" data-index="DataItem" width="150">
            <span slot="title">{{ $t("app.setting.themecolor.dust") }}</span>
            <template slot-scope="text, record">
              <span v-if="lang === 'zh-CN'">
                {{ record.DataItem }}
              </span>
              <span v-else>
                {{ record.DataItemEn }}
              </span>
            </template>
          </a-table-column>
          <a-table-column
            key="DataSensitive"
            data-index="DataSensitive"
            width="150"
          >
            <span slot="title">{{ $t("app.setting.themecolor.green") }}</span>
          </a-table-column>
          <a-table-column key="DataLevel" data-index="DataLevel" width="150">
            <span slot="title">{{ $t("app.setting.themecolor.sunset") }}</span>
          </a-table-column>
          <a-table-column
            key="ProtectionStr"
            data-index="ProtectionStr"
            width="150"
          >
            <span slot="title">{{ $t("user.register-result.msg3344") }}</span>
          </a-table-column>
        </a-table>
        <!-- 按钮配置 -->
        <template slot="footer">
          <a-button type="primary" @click="closeEyeDrawer">
            {{ $t("app.setting.themecolor.ff99999999") }}
          </a-button>
        </template>
      </a-modal>

      <a-modal  :visible="MYvisible"  width="500px"  @cancel="MYhandleOk" >
        <div v-for="(item, index) in dataList" :key="index">
          {{ item }}
        </div>
        <template slot="footer">
          <a-button type="primary" @click="MYhandleOk">
            {{ $t("app.setting.themecolor.ff99999999") }}
          </a-button>
        </template>
      </a-modal>


    </a-card>
    <Addapp ref="addappid" @child-event="getChildValue"></Addapp>
    <div class="big-box" v-if="ifLoading">
      <a-spin />
    </div>
  </div>
</template>

<script>
import { VolumeData } from "@/utils/util";
import { dataLibraryLists } from "@/api/ytdg";
import {
  appIdCreatexl,
  appIdDetail,
  appidSxq,
  dIdDetailGroup,
} from "@/api/appid";

import { dataLibraryChange, dataLibraryCreate } from "@/api/di/json";
import { configurationSelect } from "@/api/configs";
import {
  dataDelete,
  dataLibraryDelete,
  dataLibraryDetail,
  dccSelect,
  discoverFinds,
  discoverTree,
  dataExcel
} from "@/api/di/form";
import { childataItems, dccDataItemsSelect } from "@/api/dcc";
import { userQuery } from "@/api/common/form";
import axios from "axios";
import moment from "moment";
import tableSelect from "@/components/tableSelect/tableSelect.vue";
import storage from "store";
import { ACCESS_TOKEN } from "@/store/mutation-types";
import { getUserInfo } from "@/api/index";
import Addapp from "@/components/componentLibrary/addapp.vue";
import row from "ant-design-vue/lib/row";
import RpaDetail from '../dataAssessment/dpia/dpia_rpaDetail'
import jwt from 'jwt-simple'

export default {
  computed: {
    row() {
      return row;
    },
  },
  components: {
    AppIdSelect: () => import("@/components/ytdg/appidSelect.vue"),
    tableSelect,
    Addapp,
    RpaDetail,
  },
  data() {
    return {
      userroleid: "",
      // table筛选选中的列
      setValusKey: 0,
      // 筛选获取的参数
      filterData: [],
      treeLists: [],
      // 表单数据
      form: this.$form.createForm(this),
      diForm: this.$form.createForm(this),
      // 数据详情的标题内容
      detailTitle: "",
      list: [],
      selectedItems: [],
      // 用户列表
      userList: [],
      listLoading: false,
      selectedRowKeys: [],
      Xians: [
        {
          label: "线上",
          labelEn: "Online",
          value: 1,
        },
        {
          label: "线下",
          labelEn: "Offline",
          value: 2,
        },
      ],
      noFoundContentText: "请选择城市",
      modalVisible: false,
      modalTitle: "",
      visible: false,
      MYvisible: false,
      dataList:[],
      delid: "",
      current: 0,
      steps: [
        {
          title: "menu.account.logout112299227788",
          content: "firstStep",
        },
        {
          title: "menu.account.logout112299227799",
          content: "secondStip",
        },
      ],
      eyeDrawer: false,
      value: ["0-0-0"],
      total: 0,
      hasSelected: true,
      //ohter是否出现
      otherflag: false,
      //table搜索的input里面的值
      inputValue: "",
      queryForm: {
        name: undefined,
        appid: undefined,
        assetsId: undefined,
        department: undefined,
        owner: undefined,
        controller: undefined,
        entities: undefined,
        environment: undefined,
        state: undefined,
        rpaid: undefined,
      },
      tableListData: [],
      eyeDrawerList: [], // 眼睛弹窗列表
      // 新增
      appInfo: {},
      customLocale: {
        emptyText: this.$t("user.verification-code.required111566110577183"),
      },
      appInfo1: {},
      appInfo2: {},
      loading: false,
      addForm: {
        data_library_appid_id: undefined,
        data_library_controller: undefined,
        data_library_environment: undefined,
        details: [
          {
            data_item: undefined,
            data_city: undefined,
            data_deposit: undefined,
            data_source: undefined,
            data_destination: undefined,
            index: 0,
          },
        ],
        data_library_entities: undefined,
      },
      detailsIndex: 0,
      // 固定下拉的初始化
      appidLists: [],
      systemControllerSourceData: [],
      sonfigurationItemsContent: [],
      fonfigurationItemsContent: [],
      dataSubjectData: VolumeData,
      // 数据详情
      dataDetailInfoTables: [],
      // 分页数据
      pagination: {
        page: 1, //当前页
        pageSize: 10, //每页条数
        total: 0, //总条数
        showQuickJumper: true,
        hideOnSinglePage: true,
      },
      // 导入DI的最终结果数据集
      importDiResult: [],
      // 导入DI的时候选中的值
      checkedKeys: [],
      // 导入DI时的树状数据
      treeData: [],
      // 获取分类分级
      dccSelectData: [],
      // 导入的数据
      dccDiData: [],
      see: false,
      ecxelSee:false,
      // 语言
      lang: "zh-EN",
      // 数据字段
      dataItemsSearchData: [],
      kvMap: [
        "RpaId",
        "DataAssetsId",
        "AppDepartment",
        "BmwAppId",
        "BbaAppId",
        "FeatherId",
        "AppOwner",
        "",
        "DataLibraryEnvironment",
        "",
        "RpaId",
        "DataLibraryState",
        "AppName",
      ],
      okyMap: [
        "",
        "assetsIds",
        "departments",
        "bmwAppIds",
        "bbaAppIds",
        "featherIds",
        "",
        "",
        "",
        "DataLibraryController",
        "RpaId",
        "",
        "names",
      ],
      ifLoading: false,
      excelId:'',
			env: process.env.VUE_APP_BASE_API,
    };
  },
  created() {
    this.init();
    // 获取列表
    this.fetchUser("");
  },
  mounted() {
    // 语言切换监听
    let that = this;
    window.addEventListener("setItemEvent", function (e) {
      console.log(e);
      if (e.key === "lang") {
        that.lang = JSON.parse(e.value);
        if (that.lang == "zh-EN") {
          // that.tx(1);
          that.filterSearchInputOptionEn();
          that.isLang = false;
        } else {
          // that.tx();
          that.handleSearch();
          that.isLang = true;
        }
      }
    });
  },
  methods: {
    /**
     * 父组件接收子组件传递的值
     * @param data
     */
    getChildValue(data) {
      // 写入到数据列表中
      this.appidLists.push(data);
      // 获取到数据类型，指定赋值
      if (this.temporarily.types === "DataSource") {
        if (this.temporarily.DataSource.indexOf(data.value) === -1) {
          this.temporarily.DataSource.push(data.value);
        }
      } else if (this.temporarily.types === "DataDestination") {
        if (this.temporarily.DataDestination.indexOf(data.value) === -1) {
          this.temporarily.DataDestination.push(data.value);
        }
      }
    },
    // 打开新增
    onChange1(e, type) {
      this.temporarily = e;
      this.temporarily.types = type;
      this.$refs.addappid.open();
    },
    // 监听搜索
    async fetchUser(value) {
      // 获取APPID下拉数据
      let content = value;
      const { data: appidLists } = await appIdCreatexl({ content });
      this.appidLists = appidLists;
    },
    async handleDiChange(e) {
      try {
        var tempLists = [];
        const { data } = await childataItems({ id: e });
        this.dataDetailInfoTables.forEach((element, i) => {
          if (element.DataItemStr === e) {
            element.DataLevelStr = data[0].DateLevel;
            element.DataSensitiveStr = data[0].SensitivityLevel;
            element.DataItem = e;
          }
          tempLists.push(element);
        });
        this.dataDetailInfoTables = tempLists;
      } catch (error) {
        this.$message.error(error);
      }
    },
    // 查找用户信息
    async handleSearch(inputs) {
      //数据详情的数据字段
      const { data: dataItemsSearchData } = await dccDataItemsSelect({
        search: inputs,
      });
      this.dataItemsSearchData = dataItemsSearchData;
    },
    // 查找用户信息英文
    async filterSearchInputOptionEn(inputs, option) {
      //数据详情的数据字段
      this.dataItemsSearchData = [];
      const { data: dataItemsSearchData } = await dccDataItemsSelect({
        search: inputs,
      });
      this.dataItemsSearchData = dataItemsSearchData;
    },
    // 增加数据列
    changelist() {
      this.dataDetailInfoTables.push({
        DataItemStr: "-",
        RpaType: 2,
      });
    },

    /**
     * 列表筛选查询
     * @param e 筛选的值
     * @returns {Promise<void>}
     */
    async searchQueryFilter(e, original) {
      this.queryForm[this.okyMap[this.setValusKey]] = undefined;
      this.queryForm = {
        ...this.queryForm,
        [this.kvMap[this.setValusKey]]:
          this.setValusKey === 6 ? original.join("#@%$") : e,
      };
      await this.getList("filter");
    },
    /**
     * 列表搜索查询
     * @param e 搜索的值
     * @returns {Promise<void>}
     */
    async searchQuery(e) {
      this.queryForm[this.kvMap[this.setValusKey]] = undefined;
      this.queryForm = {
        ...this.queryForm,
        [this.okyMap[this.setValusKey]]: e,
      };
      await this.getList("filter");
    },
    /**
     * 数据控制者是否出现other获取
     * @param value
     */
    changeselect(value) {
      this.selectedItems = value;
      let item2 = [];
      value.forEach((item) => {
        this.systemControllerSourceData.forEach((item1, index) => {
          if (item === item1.value) {
            item2.push(item1.label);
          }
        });
      });
      if (item2.includes("Other")) {
        this.otherflag = true;
      } else {
        this.otherflag = false;
      }
    },
    //导出表格
    async start() {
      let id = this.selectedRowKeys.join(",");
      try {
        this.ifLoading = true;
        const data = await axios({
          url: `${process.env.VUE_APP_BASE_API}/v1/dataLibrary/export`,
          method: "post",
          params: { id: id },
          headers: {
            token: storage.get(ACCESS_TOKEN),
            tokens: storage.get("bmwToken") || "",
          },
          responseType: "arraybuffer",
        });
        this.ifLoading = false;
        if (data.status === 200) {
          const url = window.URL.createObjectURL(
            new Blob([data.data], {
              type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
            })
          );
          const link = document.createElement("a");
          link.style.display = "none";
          link.href = url;
          link.setAttribute("download", `平台数据${moment().format("L")}.xls`);
          document.body.appendChild(link);
          link.click();
          document.body.removeChild(link);
        } else {
          this.$message.error(
            this.$t("user.verification-code.required111566110577327")
          );
        }
      } catch (error) {
        this.$message.error(error);
      }
    },
    async handleOk(e) {
      // 清空旧的数据
      this.treeData = [];
      this.dccDiData = [];
      this.current = 0;
      try {
        // 循环处理新的数据
        for (var i = 0; i < this.importDiResult.length; i++) {
          const { data } = await childataItems({
            id: this.importDiResult[i].Rid,
          });
          this.dataDetailInfoTables.push({
            key: this.importDiResult[i].No,
            DataItemStr: this.importDiResult[i].Result,
            DataItemStrEn: this.importDiResult[i].ResultEn,
            DataItem: this.importDiResult[i].Rid,
            DataLevelStr: data[0].DateLevel,
            DataLevel: data[0].SourceDataLevel, // 数据级别
            DataSensitiveStr: data[0].SensitivityLevel, // 数据敏感度
            DataSensitive: data[0].SourceSensitivityLevel,
          });
        }
      } catch (error) {
        this.$message.error(error);
      }
      this.importDiResult = [];
      this.visible = false;
    },
    //删除
    async del(id) {
      this.listLoading = true;
      try {
        await dataDelete({ id: id });
        this.$message.success(
          this.$t("user.verification-code.required111566110577133")
        );
        await this.getList();
      } catch (error) {
        // 报错信息
        this.$message.error(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
    },
    /**
     * 清空查询数据，并且执行查询
     * @returns {Promise<void>}
     */
    async tableCleanJobs(type) {
      this.pagination.page = 1;
      if (type === "part") {
        this.queryForm[this.kvMap[this.setValusKey]] = undefined;
        this.queryForm[this.okyMap[this.setValusKey]] = undefined;
      } else {
        this.queryForm = {};
        for (let i = 1; i <= 12; i++) {
          let dom = this.$refs[`tableselect${i}`];
          if (dom) {
            dom.inputValue = "";
            dom.inputCheckValue = [];
          }
        }
      }
      this.inputValue = "";
      await this.getList();
    },
    /**
     * 查询Filter逻辑
     * @param typeId 类型编号
     * @returns {Promise<void>}
     */

    async setValus(typeId) {
      this.listLoading = true;
      try {
        const { data } = await dIdDetailGroup({ condition: typeId });
        // 赋值类型，用于筛选、搜索的直接调用
        this.setValusKey = typeId;
        // 赋值筛选的列表，直接赋值
        let lang = localStorage.getItem("lang");
        for (let i = 0; i < data.length; i++) {
          if (lang === '"zh-EN"') {
            data[i].text = data[i].texten ?? data[i].text;
          } else if (typeId === 11) {
            data[i].text = data[i].value
              ? data[i].value === 1
                ? this.$t("user.verification-code.required111566133")
                : this.$t("user.verification-code.required111566144")
              : this.$t("menu.account.setting.offline1111");
          }
        }
        this.filterData = data;
      } catch (error) {
        // 报错信息
        this.$message.error(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
    },
    async mate() {
      var tempLists = [];
      this.importDiResult = [];
      // 开始匹配数据
      for (var i = 0; i < this.dccDiData.length; i++) {
        // 发起查询匹配
        const { data } = await discoverFinds({
          Items: this.dccDiData[i].Items1,
          Classification: this.dccDiData[i].Classification,
        });
        // 判断返回结果
        if (data.Result !== "未匹配") {
          this.dccDiData[i].Result = data.Info;
          this.dccDiData[i].ResultEn = data.InfoEn;
          this.dccDiData[i].Rid = data.Id;
          this.importDiResult.push(this.dccDiData[i]);
        } else {
          this.dccDiData[i].Result = data.Result;
          this.dccDiData[i].ResultEn = data.ResultEn;
          this.dccDiData[i].Rid = 0;
        }
        tempLists.push(this.dccDiData[i]);
      }
      this.dccDiData = tempLists;
    },
    async handleChangeDiAppid(value, index) {
      // 根据APPID查数据发现的字段
      const { data } = await discoverTree({ DiscoverAppId: index.key });
      this.treeData = data.treeData;
      this.checkedKeys = data.ids;
    },
    /**
     * 初始化数据
     * @returns {Promise<void>}
     */
    async init() {
      //获取用户信息
      const { data } = await getUserInfo();
      this.userroleid = data.role;
      this.userdata = data;
      this.userroleid = data.role;
      //数据详情的数据字段
      const { data: dataItemsSearchData } = await dccDataItemsSelect();
      this.dataItemsSearchData = [];
      this.dataItemsSearchData = dataItemsSearchData;
      // 加载数据控制者数据
      const { data: systemControllerSourceData } = await configurationSelect({
        state: 11,
      });
      // 城市
      const { data: sonfigurationItemsContent } = await appidSxq({ state: 3 });
      // 存放地
      const { data: fonfigurationItemsContent } = await appidSxq({ state: 4 });
      // 分类分级数据
      const { data: dccSelectData } = await dccSelect();
      // 获取用户列表下拉
      const { data: userList } = await userQuery(1);
      this.userList = userList;
      this.dccSelectData = dccSelectData;
      this.systemControllerSourceData = systemControllerSourceData;
      this.sonfigurationItemsContent = sonfigurationItemsContent;
      this.fonfigurationItemsContent = fonfigurationItemsContent;
      if (this.$t("user.login.userName").trim() === "数据盘库表") {
        this.lang = "zh-CN";
      }
      // 获取列表数据
      await this.getList();
    },
    async submitSave() {
      // 保存草稿
      const {
        form: { validateFields },
      } = this;
      // 按钮loading
      this.loading = true;
      validateFields({ force: false }, async (err, values) => {
        try {
          if (values.DataLibraryController != undefined) {
            values.DataLibraryController =
              values.DataLibraryController.join(",");
          }
          values["Details"] = this.dataDetailInfoTables;
          values["DataLibraryState"] = 2;
          var tempLists = [];
          for (var i = 0; i < this.dataDetailInfoTables.length; i++) {
            if (
              !this.dataDetailInfoTables[i].DataCity ||
              this.dataDetailInfoTables[i].DataCity.length == 0
            ) {
              this.$message.error(this.$t("menu.account.logout1122992244"));
              return;
            }
            if (
              !this.dataDetailInfoTables[i].DataDeposit ||
              this.dataDetailInfoTables[i].DataDeposit.length == 0
            ) {
              this.$message.error(this.$t("menu.account.logout1122992255"));
              return;
            }
            if (
              !this.dataDetailInfoTables[i].DataSource ||
              this.dataDetailInfoTables[i].DataSource.length == 0
            ) {
              this.$message.error(this.$t("menu.account.logout1122992266"));
              return;
            }
            if (
              !this.dataDetailInfoTables[i].DataDestination ||
              this.dataDetailInfoTables[i].DataDestination.length == 0
            ) {
              this.$message.error(this.$t("menu.account.logout1122992277"));
              return;
            }
          }
          for (var i = 0; i < this.dataDetailInfoTables.length; i++) {
            this.dataDetailInfoTables[i].DataCity =
              this.dataDetailInfoTables[i].DataCity.join(",");
            this.dataDetailInfoTables[i].DataDeposit =
              this.dataDetailInfoTables[i].DataDeposit.join(",");
            this.dataDetailInfoTables[i].DataSource =
              this.dataDetailInfoTables[i].DataSource.join(",");
            this.dataDetailInfoTables[i].DataDestination =
              this.dataDetailInfoTables[i].DataDestination.join(",");
            tempLists.push(this.dataDetailInfoTables[i]);
          }
          values["Details"] = tempLists;
          values["DataLibraryState"] = 1;
          if (values.Id != undefined) {
            const { data } = await dataLibraryChange({ ...values });
          } else {
            const { data } = await dataLibraryCreate({ ...values });
          }
        } catch (error) {
          this.$message.error(error);
        } finally {
          this.loading = false;
        }
        this.dataDetailInfoTables = [];
        this.otherflag = false;
        this.modalVisible = false;
        await this.getList();
      });
    },
    async submitCreate() {
      // 提交新建
      const {
        form: { validateFields },
      } = this;
      // 按钮loading
      this.loading = true;
      validateFields({ force: true }, async (err, values) => {
        if (!err) {
          try {
            if (this.dataDetailInfoTables.length < 1) {
              this.$message.error(
                this.$t("user.verification-code.required111566110577342")
              );
              return;
            }
            values.DataLibraryEnvironment = parseInt(
              values.DataLibraryEnvironment
            );
            values["Details"] = this.dataDetailInfoTables;

            values.DataLibraryController =
              values.DataLibraryController.join(",");
            values["DataLibraryState"] = 2;

            var tempLists = [];
            for (var i = 0; i < this.dataDetailInfoTables.length; i++) {
              if (
                !this.dataDetailInfoTables[i].DataCity ||
                this.dataDetailInfoTables[i].DataCity.length == 0
              ) {
                this.$message.error(this.$t("menu.account.logout1122992244"));
                return;
              }
              if (
                !this.dataDetailInfoTables[i].DataDeposit ||
                this.dataDetailInfoTables[i].DataDeposit.length == 0
              ) {
                this.$message.error(this.$t("menu.account.logout1122992255"));

                return;
              }
              if (
                !this.dataDetailInfoTables[i].DataSource ||
                this.dataDetailInfoTables[i].DataSource.length == 0
              ) {
                this.$message.error(this.$t("menu.account.logout1122992266"));

                return;
              }
              if (
                !this.dataDetailInfoTables[i].DataDestination ||
                this.dataDetailInfoTables[i].DataDestination.length == 0
              ) {
                this.$message.error(this.$t("menu.account.logout1122992277"));

                return;
              }
            }
            for (var i = 0; i < this.dataDetailInfoTables.length; i++) {
              this.dataDetailInfoTables[i].DataCity =
                this.dataDetailInfoTables[i].DataCity.join(",");
              this.dataDetailInfoTables[i].DataDeposit =
                this.dataDetailInfoTables[i].DataDeposit.join(",");
              this.dataDetailInfoTables[i].DataSource =
                this.dataDetailInfoTables[i].DataSource.join(",");
              this.dataDetailInfoTables[i].DataDestination =
                this.dataDetailInfoTables[i].DataDestination.join(",");

              tempLists.push(this.dataDetailInfoTables[i]);
            }
            values["Details"] = tempLists;

            if (values.Id != undefined) {
              const { data } = await dataLibraryChange({ ...values });
            } else {
              const { data } = await dataLibraryCreate({ ...values });
            }
            this.$message.success(
              this.$t("user.verification-code.required111566171")
            );
          } catch (error) {
            this.$message.error(error);
          } finally {
            this.loading = false;
          }
          this.dataDetailInfoTables = [];
          this.otherflag = false;
          this.modalVisible = false;
          await this.getList();
        } else {
          setTimeout(() => {
            this.loading = false;
          }, 600);
        }
      });
    },
    async handleChangeAppid(value, index) {
      const { data } = await appIdDetail({ id: index.key });
      this.form.setFieldsValue({
        AppidName: data.AppName,
        AppOwner: data.AppOwner,
        AppDepartment: data.AppDepartment,
        BbaAppId: data.BbaAppId,
        BmwAppId: data.BmwAppId,
        FeatherId: data.FeatherId,
      });
    },
    // 分页事件 直接复制使用 通用的
    tableChange(e, searchInputs) {
      let parames = Object.keys(searchInputs);
      for (var i = 0; i < parames.length; i++) {
        searchInputs[parames[i]] = searchInputs[parames[i]].join();
      }
      this.queryForm = { ...searchInputs };
      this.getList("filter");
    },
    // 获取列表
    async getList(state) {
      this.listLoading = true;
      const { page, pageSize } = this.pagination;
      try {
        if (state === "filter") {
          // 调用查询列表
          const { data } = await dataLibraryLists({
            ...{ page: 1, pageSize: 10 },
            ...this.queryForm,
          });
          // 解构赋值
          const { Page, PageSize, Total, Lists } = data;
          // 给table赋值
          this.tableListData = Lists || [];
          // 给分页数据赋值
          this.pagination = {
            page: Page,
            pageSize: PageSize,
            total: Total,
          };
        } else {
          // 调用查询列表
          const { data } = await dataLibraryLists({
            ...{ page, pageSize },
            ...this.queryForm,
          });
          // 解构赋值
          const { Page, PageSize, Total, Lists } = data;
          // 给table赋值
          this.tableListData = Lists || [];
          // 给分页数据赋值
          this.pagination = {
            page: Page,
            pageSize: PageSize,
            total: Total,
          };
        }
      } catch (error) {
        // 报错信息
        this.$message.error(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
    },
    // 重置
    restQuery() {
      this.queryForm = {
        name: undefined,
        appid: undefined,
        assetsId: undefined,
        department: undefined,
        owner: undefined,
        controller: undefined,
        entities: undefined,
        environment: undefined,
        state: undefined,
        rpaid: undefined,
      };
      this.getList();
    },
    async showModal(state, id) {
      // console.log(id);
      this.excelId = id
      // console.log("this.excelId", this.excelId);
      // 数据清空   
      this.form.resetFields();
      this.modalVisible = true;
      if (state == "detail") {
        this.see = true;
      }
      if (state == "edit" || state == "detail") {
        // 查基础数据DataLibraryEnvironment
        // this.otherflag=true;
        this.delid = id;
        const { data: dataInfo } = await dataLibraryDetail({ Id: this.delid });
        // console.log('dataInfo',dataInfo);
        if (dataInfo.DataLibraryControllerOther != "") {
          this.otherflag = true;
        } else {
          this.otherflag = false;
        }
        let arr3 = [];
        if (dataInfo.DataLibraryController == "") {
          arr3 = undefined;
        } else {
          let arr1 = dataInfo.DataLibraryController.split(",");
          arr1.forEach((item) => {
            arr3.push(parseInt(item));
          });
        }
        let DataUpdatetime = "";
        if (dataInfo.DataLibraryUpdatetime == "") {
          DataUpdatetime = "N/A";
        } else {
          DataUpdatetime = dataInfo.DataLibraryUpdatetime;
        }
        let DataCreateTime = "";
        if (dataInfo.DataLibraryCreatetime == "") {
          DataCreateTime = "N/A";
        } else {
          DataCreateTime = dataInfo.DataLibraryCreatetime;
        }
        let DataappidId = "";
        if (dataInfo.DataLibraryAppidId == 0) {
          DataappidId = undefined;
        } else {
          DataappidId = dataInfo.DataLibraryAppidId;
        }
        await this.$nextTick();
        // console.log("===> ", dataInfo.DataLibraryEnvironment);
        this.form.setFieldsValue({
          DataLibraryAppidId: DataappidId,
          DataLibraryCreateTime: DataCreateTime,
          DataLibraryUpdateTime: DataUpdatetime,
          DataLibraryController: arr3,
          DataLibraryControllerOther: dataInfo.DataLibraryControllerOther,
          DataLibraryEnvironment: dataInfo.DataLibraryEnvironment
            ? dataInfo.DataLibraryEnvironment
            : null,
          DataLibraryEntities: dataInfo.DataLibraryEntities,
          DataAssetsId: dataInfo.DataAssetsId,
          DataLibraryUser: dataInfo.DataLibraryUser,
          Id: dataInfo.Id,
          BmwAppId: dataInfo.BmwAppId,
          BbaAppId: dataInfo.BbaAppId,
          FeatherId: dataInfo.FeatherId,
        });
        this.handleChangeAppid("", { key: dataInfo.DataLibraryAppidId });

        let tempLists = [];
        await this.$nextTick();
        if (dataInfo.Details) {
          for (var i = 0; i < dataInfo.Details.length; i++) {
            var arr5 = [];
            dataInfo.Details[i].DataCity.split(",").forEach((item) => {
              if (item != "NaN" && item) {
                arr5.push(parseInt(item));
              }
            });
            var arr6 = [];
            dataInfo.Details[i].DataDeposit.split(",").forEach((item) => {
              if (item != "NaN" && item) {
                arr6.push(parseInt(item));
              }
            });
            var arr7 = [];
            dataInfo.Details[i].DataSource.split(",").forEach((item) => {
              if (item != "NaN" && item) {
                arr7.push(parseInt(item));
              }
            });
            var arr8 = [];
            dataInfo.Details[i].DataDestination.split(",").forEach((item) => {
              if (item != "NaN" && item) {
                arr8.push(parseInt(item));
              }
            });
            // console.log("===> ", dataInfo.Details[i]);
              //数据字段
            if ( dataInfo.Details[i].DataItemStr) {
                if (localStorage.getItem('lang') == '"zh-CN"') {
                    this.filterSearchInputOption( dataInfo.Details[i].DataItemStr)
                } else if (localStorage.getItem('lang') == '"zh-EN"') {
                    this.filterSearchInputOptionEn( dataInfo.Details[i].DataItemStr)
                }
            }
            if ( dataInfo.Details[i].DataDestinationStr) {
				let DataDestinationStr = dataInfo.Details[i].DataDestinationStr.split(',')
				DataDestinationStr.map((item) => {
					this.appIdCreatexlFz(item)
				})
			}
            if ( dataInfo.Details[i].SourceStr) {
				let SourceStr =  dataInfo.Details[i].SourceStr.split(',')
				SourceStr.map((item) => {
					this.appIdCreatexlFz(item)
				})
			}
            var tempItems = {
              Id: dataInfo.Details[i].Id,
              key: dataInfo.Details[i].Id,
              DataItemStr: dataInfo.Details[i].DataItemsStr,
              DataItemStrEn: dataInfo.Details[i].DataItemsStrEn,
              DataItem: dataInfo.Details[i].DataItem,
              DataLevelStr: dataInfo.Details[i].DataLevelStr,
              DataLevel: dataInfo.Details[i].SourceDataLevel, // 数据级别
              DataSensitiveStr: dataInfo.Details[i].DataSensitivityStr, // 数据敏感度
              DataSensitive: dataInfo.Details[i].SourceDataSensitive,
              DataCity: arr5,
              DataDeposit: arr6,
              DataSource: arr7,
              DataDestination: arr8,
            };
            tempLists.push(tempItems);
          }
        }
        this.dataDetailInfoTables = tempLists;
      }

      if (state == "edit") {
        this.ecxelSee = true
        this.modalTitle = this.$t("user.verification-code.required1115667777");
      } else if (state == "add") {
        this.ecxelSee = false
        this.modalTitle = this.$t("user.verification-code.required1115667766");
      } else if (state == "detail") {
        this.ecxelSee = false
        this.modalTitle = this.$t(
          "user.verification-code.required11156677888888"
        );
      }
    },
    async appIdCreatexlFz(val) {
		const { data: appidLists } = await appIdCreatexl({
			content: val,
			types: 1,
		})
		this.appidLists = this.appidLists.concat(appidLists)
		const arr = this.appidLists.concat(appidLists);
		const result = Array.from(new Set(arr.map(item => JSON.stringify(item)))).map(item => JSON.parse(item));
		this.appidLists = result;
	},
    async updateTable() {
      const { data: dataInfo } = await dataLibraryDetail({ Id: this.delid });
        // console.log('dataInfo',dataInfo);

        if (dataInfo.DataLibraryControllerOther != "") {
          this.otherflag = true;
        } else {
          this.otherflag = false;
        }
        let arr3 = [];
        if (dataInfo.DataLibraryController == "") {
          arr3 = undefined;
        } else {
          let arr1 = dataInfo.DataLibraryController.split(",");
          arr1.forEach((item) => {
            arr3.push(parseInt(item));
          });
        }
        let DataUpdatetime = "";
        if (dataInfo.DataLibraryUpdatetime == "") {
          DataUpdatetime = "N/A";
        } else {
          DataUpdatetime = dataInfo.DataLibraryUpdatetime;
        }
        let DataCreateTime = "";
        if (dataInfo.DataLibraryCreatetime == "") {
          DataCreateTime = "N/A";
        } else {
          DataCreateTime = dataInfo.DataLibraryCreatetime;
        }
        let DataappidId = "";
        if (dataInfo.DataLibraryAppidId == 0) {
          DataappidId = undefined;
        } else {
          DataappidId = dataInfo.DataLibraryAppidId;
        }
        await this.$nextTick();
        // console.log("===> ", dataInfo.DataLibraryEnvironment);
        this.form.setFieldsValue({
          DataLibraryAppidId: DataappidId,
          DataLibraryCreateTime: DataCreateTime,
          DataLibraryUpdateTime: DataUpdatetime,
          DataLibraryController: arr3,
          DataLibraryControllerOther: dataInfo.DataLibraryControllerOther,
          DataLibraryEnvironment: dataInfo.DataLibraryEnvironment
            ? dataInfo.DataLibraryEnvironment
            : null,
          DataLibraryEntities: dataInfo.DataLibraryEntities,
          DataAssetsId: dataInfo.DataAssetsId,
          DataLibraryUser: dataInfo.DataLibraryUser,
          Id: dataInfo.Id,
          BmwAppId: dataInfo.BmwAppId,
          BbaAppId: dataInfo.BbaAppId,
          FeatherId: dataInfo.FeatherId,
        });
        this.handleChangeAppid("", { key: dataInfo.DataLibraryAppidId });

        let tempLists = [];
        await this.$nextTick();
        if (dataInfo.Details) {
          for (var i = 0; i < dataInfo.Details.length; i++) {
            var arr5 = [];
            dataInfo.Details[i].DataCity.split(",").forEach((item) => {
              if (item != "NaN" && item) {
                arr5.push(parseInt(item));
              }
            });
            var arr6 = [];
            dataInfo.Details[i].DataDeposit.split(",").forEach((item) => {
              if (item != "NaN" && item) {
                arr6.push(parseInt(item));
              }
            });
            var arr7 = [];
            dataInfo.Details[i].DataSource.split(",").forEach((item) => {
              if (item != "NaN" && item) {
                arr7.push(parseInt(item));
              }
            });
            var arr8 = [];
            dataInfo.Details[i].DataDestination.split(",").forEach((item) => {
              if (item != "NaN" && item) {
                arr8.push(parseInt(item));
              }
            });
            // console.log("===> ", dataInfo.Details[i]);
            console.log("===> ", dataInfo.Details[i].DataItemStr);
            //数据字段
            if ( dataInfo.Details[i].DataItemStr) {
                if (localStorage.getItem('lang') == '"zh-CN"') {
                    this.filterSearchInputOption( dataInfo.Details[i].DataItemStr)
                } else if (localStorage.getItem('lang') == '"zh-EN"') {
                    this.filterSearchInputOptionEn( dataInfo.Details[i].DataItemStr)
                }
            }
            if ( dataInfo.Details[i].DataDestinationStr) {
				let DataDestinationStr = dataInfo.Details[i].DataDestinationStr.split(',')
				DataDestinationStr.map((item) => {
					this.appIdCreatexlFz(item)
				})
			}
            if ( dataInfo.Details[i].SourceStr) {
				let SourceStr =  dataInfo.Details[i].SourceStr.split(',')
				SourceStr.map((item) => {
					this.appIdCreatexlFz(item)
				})
			}
            var tempItems = {
              Id: dataInfo.Details[i].Id,
              key: dataInfo.Details[i].Id,
              DataItemStr: dataInfo.Details[i].DataItemsStr,
              DataItemStrEn: dataInfo.Details[i].DataItemsStrEn,
              DataItem: dataInfo.Details[i].DataItem,
              DataLevelStr: dataInfo.Details[i].DataLevelStr,
              DataLevel: dataInfo.Details[i].SourceDataLevel, // 数据级别
              DataSensitiveStr: dataInfo.Details[i].DataSensitivityStr, // 数据敏感度
              DataSensitive: dataInfo.Details[i].SourceDataSensitive,
              DataCity: arr5,
              DataDeposit: arr6,
              DataSource: arr7,
              DataDestination: arr8,
            };

            tempLists.push(tempItems);
          }
        }
        this.dataDetailInfoTables = tempLists;
    },

    // 关闭抽屉
    closeDrawer() {
      this.otherflag = false;
      this.see = false;
      this.loading = false;
      this.dataDetailInfoTables = [];
      this.modalVisible = false;
    },
    /**
     * 删除DI
     * @param record DI记录
     * @returns {Promise<void>}
     */
    async deletes(record) {
      try {
        await dataLibraryDelete({ Id: record.Id });
        this.dataDetailInfoTables.splice(
          this.dataDetailInfoTables.indexOf(record),
          1
        );
        this.$message.success(
          this.$t("user.verification-code.required111566110577133")
        );
      } catch (error) {
        // 报错信息
        this.$message.error(error);
      }
    },
    /**
     * 打开抽屉
     */
    openModal() {
      this.diForm.resetFields();
      this.visible = true;
    },
    async handleFileUpload(e) {
      let formdata = new FormData()
			formdata.append('file', e.file)
      formdata.append("id",this.excelId);

      try {
				const response = await axios({
					url: `${this.env}/v1/dataLibrary/fields/import/excel`,
					method: 'post',
					data: formdata,
					headers: {
						token: storage.get(ACCESS_TOKEN),
            tokens: storage.get("bmwToken") || "",
            YtAuth: jwt.encode({ bmw: 1 }, 'jwt'),
					},
				})
        this.updateTable()
        this.MYvisible = true;
        
        this.dataList = response.data.data;
        // console.log(this.dataList,'this.dataListthis.dataList');
			} catch (error) {
				console.log(error)
				this.$message.error(error)
			} 
    },
    MYhandleOk() {
      this.MYvisible = false;
    },
    handleCancel(e) {
      this.treeData = [];
      this.dccDiData = [];
      this.current = 0;
      this.importDiResult = [];
      // 取消关闭抽屉
      this.visible = false;
    },
    next() {
      // 保存草稿
      const {
        diForm: { validateFields },
      } = this;
      // 按钮loading
      this.loading = true;
      validateFields({ force: false }, async (err, values) => {
        if (!err) {
          let res = []; // 用于存储递归结果（扁平数据）
          // 递归函数
          let fn = (source) => {
            source.forEach((el) => {
              res.push(el);
              el.children && el.children.length > 0 ? fn(el.children) : ""; // 子级递归
            });
          };
          fn(this.treeData);
          // 将结果数据插入到列表中
          this.dccDiData = [];
          for (var i = 0; i < res.length; i++) {
            var dataImport = {};
            if (this.checkedKeys.indexOf(res[i].key) != -1) {
              dataImport["Id"] = res[i].key;
              const data = res[i].title.split("/");
              if (data.length > 1) {
                // 0为前，1为备注
                dataImport["Items"] = data[1];
                dataImport["Items1"] = data[1];
              } else {
                dataImport["Items"] = data[0];
                dataImport["Items1"] = data[0];
              }
              this.dccDiData.push(dataImport);
            }
          }
          this.current++;
        } else {
          setTimeout(() => {}, 600);
        }
      });
    },
    prev() {
      this.current--;
    },
    showEye(data) {
      this.detailTitle =
        data.DataAssetsId +
        this.$t("user.verification-code.required111566110577145");
      this.eyeDrawerList = [];
      this.eyeDrawerList = data.details;
      this.eyeDrawer = true;
    },
    closeEyeDrawer() {
      this.eyeDrawer = false;
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
  },
};
</script>

<style lang="less" scoped>
.blocks {
  color: #5076a5;
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.card {
  display: flex;
  align-items: center;
  border-radius: 8px;
  box-shadow: 2px 5px 5px rgba(0, 0, 0, 0.3);
  padding: 20px;
  padding-right: 150px;

  h4 {
    font-size: 30px;
  }

  p {
    font-size: 16px;
    color: #999;
  }
}

/deep/ .drawer-form {
  margin-bottom: 40px;

  .ant-form-item-label {
    display: inline-block;
    line-height: 40px;
    width: 100px;
    margin-right: 10px;
  }
}

.find-button {
  float: left;
  margin-top: -50px;
  margin-left: 100px;
}

.ant-pagination {
  float: right;
}

.ty {
  width: 13px;
  height: 13px;
  opacity: 1;
  background: rgba(255, 255, 255, 1);
  border: 4px solid #5076a5;
  border-radius: 50%;
}

.fa {
  position: relative;
}

.ant-dropdown-link {
  color: #5076a5;
}

.appids {
  margin-left: 90px;
}

/deep/ .ant-form-item-label {
  overflow: visible !important;
}
.big-box {
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.7);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999999;
  display: flex;
  justify-content: center;
  align-items: center;
}
:deep(.ant-form-item) {
  margin-bottom: 0;
}
</style>